import { Card, Form, Input, Button } from 'antd';
import {IUser} from '@/utils/type'
import $http from '@/api/http'
import {useNavigate} from 'react-router-dom'
const Login: React.FC = () => {
    const nav=useNavigate()
    const onFinish = async(values:IUser) => {
       let result=await $http.users.login(values)
       if(result.data.code){
         localStorage.setItem('token',JSON.stringify(result.data.data.token))
         nav('/',{replace:true})
       }
    }
    return (
        <div className='loginContainer'>
            <Card title="用户登录" bordered={true} className="loginBox">
                <Form
                    onFinish={onFinish}>
                    <Form.Item
                        label="用户名"
                        name="account"
                        rules={[{ required: true, message: '请输入您的用户名!' }]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        label="密码"
                        name="password"
                        rules={[{ required: true, message: '请输入您的密码!' }]}
                    >
                        <Input.Password />
                    </Form.Item>
                    <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                        <Button type="primary" htmlType="submit">
                            提交
                        </Button>
                    </Form.Item>
                </Form>
            </Card>
        </div>
    )
}
export default Login